/**
* @description: 人员分工详情
* @author: wqn
* @data:2023年6月26日
* @remark:
**/

<template>
  <view class="division">
    <nav-bar title="人员分工详情" @goBack="goBack"></nav-bar>
    <view class="main">
      <view class="title">
        <text>人员分工</text>
      </view>
      <view class="main-content" v-for="(item,index) in ryfgData" :key="index">
        <view class="content-top">
          <img style="width: 22px;height: 22px;" src="../../../../static/standardizedOperationImg/zxckBlue.png" alt="">
          <text>{{ item.title }}</text>
        </view>
        <view class="content-form">
          <van-form>
            <van-field
                v-model="item.child.chargePerson"
                label="责任人"
                readonly
                input-align="right"
            />
            <van-field
                v-model="item.child.chargePerson"
                label="作业成员"
                input-align="right"
            />
            <van-field
                v-model="item.child.chargePerson"
                label="班组成员"
                readonly
                input-align="right"
            />
            <van-field
                v-model="item.child.chargePerson"
                label="外部厂商成员"
                readonly
                input-align="right"
            />
          </van-form>
        </view>
      </view>
	  <van-empty v-if="ryfgData.length === 0" description="暂无数据" />
    </view>
  </view>
</template>

<script>
import NavBar from "../../../standardizedOperation/common/navBar.vue";
export default {
  name: "index",
  components: {NavBar},
  data() {
    return {
      ryfgData: [
        {
          title: '待检修光缆确认',
          child: {
            chargePerson: '',
            itemMember: '',
            classPerson: '',
            outsidePerson: '',
          }
        },
        {
          title: '新光缆确认',
          child: {
            chargePerson: '',
            itemMember: '',
            classPerson: '',
            outsidePerson: '',
          }
        },
        {
          title: '新光缆确认',
          child: {
            chargePerson: '',
            itemMember: '',
            classPerson: '',
            outsidePerson: '',
          }
        },
      ],
    }
  },
  methods: {
    goBack() {
      uni.navigateBack()
    },
  }
}
</script>

<style lang="scss" scoped>
.division {
  width: 100vw;
  background: #F2F6FA;

  .main {
    margin: px2vh(50) px2vw(30) px2vh(30);
    overflow: hidden;

    text {
      font-weight: bold;
      font-size: px2vh(40);
      color: #666666;
    }

    .title {
      margin-bottom: px2vh(30);
    }

    .main-content {
      background: #FFFFFF;
      border-radius: px2vh(20);
      overflow: hidden;
      margin-bottom: px2vh(30);

      .content-top {
        display: flex;
        align-items: center;
        margin: px2vh(52) auto px2vh(20) px2vw(50);

        text {
          font-size: px2vh(42);
          margin-left: px2vh(18);
        }
      }

      .content-form {
        margin-left: px2vw(30);
      }
    }
  }
}

</style>